<template>
  <el-aside width="200">
    <xt-menu
      class="aside-menu-container select-none h-full"
      router
      :default-active="defualtActive"
      :collapse="isCollapse"
      :list="menuList"
      unique-opened
    />
  </el-aside>
</template>

<script lang="ts">
export default {
  name: "BaseLayoutAside",
};
</script>

<script lang="ts" setup>
import { ref, computed, getCurrentInstance, onMounted } from "vue";
import useSystemStore from "@/pinia/system";
import useMenuStore from "@/pinia/menu";
import { MenuType } from "@/typings";
const systemStore = useSystemStore();
const menuStore = useMenuStore();

// 获取默认激活菜单
const curIns: any = getCurrentInstance()?.proxy;
const defualtActive = computed(() => {
  return curIns?.$route.path;
});

// 菜单是否收缩
const isCollapse = computed(() => {
  return systemStore.isCollapse;
});

const menuList = ref<MenuType[]>([]);
onMounted(async () => {
  menuList.value = await menuStore.setAuthMenu();
});
</script>

<style lang="scss" scoped>
.aside-menu-container {
  &:not(.el-menu--collapse) {
    width: 200px;
  }
}
</style>
